<template>
  <d2-container>
    <el-card shadow="never">
      <el-form label-width="80px">
        <el-form-item label="连接类型">
          <el-input v-model="value" disabled style="width:200px"></el-input>
        </el-form-item>
      </el-form>
      <el-row :gutter="20">
        <el-col :span="10">
          <p>账户列表</p>
          <el-table
            border
            ref="singleTable"
            :data="ruleData"
            highlight-current-row
            :header-cell-style="{ background: '#eef1f6','text-align': 'center' }"
            @current-change="handleCurrentChange"
          >
            <el-table-column property="CounterName" label="期货公司" sortable>
            </el-table-column>
            <el-table-column property="RealAccountCode" label="柜台账户">
            </el-table-column>
            <el-table-column property="RealAccountName" label="账户名称">
            </el-table-column>
          </el-table>
          <div
            style="display:flex;justify-content:space-between;margin:10px 0px"
          >
            <el-button
              style="padding:7px"
              size="mini"
              icon="el-icon-plus"
            ></el-button>
            <el-button
              style="padding:7px"
              size="mini"
              icon="el-icon-minus"
            ></el-button>
          </div>
          <!-- <el-select v-model="values" placeholder="请选择" disabled>
            <el-option
              v-for="item in optionsone"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-button @click="anniu()">按钮</el-button> -->
        </el-col>
        <el-col :span="12">
          <p>账户消息</p>
          <el-card shadow="never">
            <el-form label-width="90px">
              <el-form-item label="期货公司：">
                <!-- <el-select disabled v-model="value" style="width:250px">
                  <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                  </el-option>
                </el-select> -->
                <el-input v-model="gs" style="width:250px" disabled></el-input>
              </el-form-item>
              <el-form-item label="账号：">
                <el-input v-model="name" style="width:250px"></el-input>
              </el-form-item>
              <el-form-item label="密码：">
                <el-input v-model="password" style="width:250px"></el-input>
              </el-form-item>
              <el-form-item style="text-align:right">
                <el-button size="mini">保存</el-button>
              </el-form-item>
            </el-form>
          </el-card>
        </el-col>
      </el-row>
    </el-card>
  </d2-container>
</template>
<script>
import { return_account } from "../../../api/url";
export default {
  data() {
    return {
      value: "柜台账户",
      gs: "",
      name: "",
      password: "",
      ruleData: [{ name: "001" }, { name: "002" }, { name: "003" }],
      currentRow: "",
      options: [],
      optionsone: [
        {
          value: "选项1",
          label: "黄金糕"
        },
        {
          value: "选项2",
          label: "双皮奶"
        },
        {
          value: "选项3",
          label: "蚵仔煎"
        },
        {
          value: "选项4",
          label: "龙须面"
        },
        {
          value: "选项5",
          label: "北京烤鸭"
        }
      ],
      values: ""
    };
  },
  created() {
    this.values='选项5'
    this.shuju_fn();
  },
  methods: {
    shuju_fn() {
      var data = {
        account_type: "real"
      };
      return_account(data).then(res => {
        this.ruleData = res.result;
      });
    },
    handleCurrentChange(val) {
      this.currentRow = val;
      this.gs = val.BrokerID;
    }
  }
};
</script>
